import Vue from "./index";
import { initState } from "./initState";
import { compileToFunction } from './compile/index'
import { callHook, mounetCompoent } from "./lifecycle";
import { mergeOptions } from "./utils/index";
export function initMixin (Vue) {
    Vue.prototype._init = function (options) {
        let vm = this
       
        // 合并属性
        // vm.$options = mergeOptions(Vue.options,options)
        vm.$options = mergeOptions(this.constructor.options,options)
        console.log(vm.$options);
        callHook(vm,'beforeCreate')
        // 初始化状态
        initState(vm)
        callHook(vm,'created')
        // 渲染模板
        if(vm.$options.el){
            vm.$mount(vm.$options.el)
        }
    }
}
// 创建$Mount
Vue.prototype.$mount = function (el) {
    // vue中可以通过 render>template>el渲染页面
    // 他们的顺序是先render>template>el
    let vm = this;
     el = document.querySelector(el);
     vm.$el = el;
    let options = vm.$options
    if(!options.render){
        let template = options.template
        if(!template && el){
            // 获取html
            el = el.outerHTML
            let render = compileToFunction(el)
            // 将render函数变为vnode
            options.render = render
            // 将vnode变为真实dom,放到页面上去
        }
        // 挂载组件
        mounetCompoent(vm,el)
    }
}


// ast语法树